<template>
  <div class="askList back-white">
    <el-container>
      <el-main>
        <el-form label-width="80px">
          <el-form-item>
            <el-select v-model="statusSelect" placeholder="请选择">
              <el-option
                v-for="item in statusList"
                :key="item.status"
                :label="item.text"
                :value="item.status">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item><el-button type="primary" @click="getData">查询</el-button></el-form-item>
        </el-form>
        <div class="x-item x-item-none back-white">
            <el-table border :data="list">
              <el-table-column label="id" prop="id" width="80px"></el-table-column>
              <el-table-column align="center" label="问诊医生" prop="doctors">
                <tamplate slot-scope="scope">
                  <div class="imgClu iw80 dib">
                    <img :src="'http://renqing123.oss-cn-shenzhen.aliyuncs.com/' + scope.row.doctors.avatar" alt="">
                  </div>
                  <p class="x-fs-070 x-co3-5">{{scope.row.doctors.name}}</p>
                </tamplate>
              </el-table-column>
              <el-table-column label="用户昵称" prop="name"></el-table-column>
              <el-table-column label="病症" prop="result"></el-table-column>
              <el-table-column label="创建预约时间" prop="create_time"></el-table-column>
              <el-table-column label="预约问诊时间" prop="doctorInquirys.inquiry_start_time"></el-table-column>
              <el-table-column label="问诊状态" prop="status">
                <tamplate slot-scope="scope">
                  <span v-if="scope.row.status == 0">待付款</span>
                  <span v-if="scope.row.status == 1">未开始</span>
                  <span v-if="scope.row.status == 2">进行中</span>
                  <span v-if="scope.row.status == 3">已结束</span>
                </tamplate>
              </el-table-column>
              <el-table-column label="问诊费用" prop="price"></el-table-column>
              <el-table-column label="问诊结果" prop="orders">
                <tenplate slot-scope="scope">
                  <span v-if="!scope.row.orders">无</span>
                  <span v-else>开处方</span>
                </tenplate>
              </el-table-column>
              <el-table-column label="操作" prop="status">
                <template slot-scope="scope">
                  <el-button type="text" size="small" @click="userDelete(scope.row.id)">删除</el-button>
                  <el-button type="text" size="small" @click="seeDetail(scope.row.id)">查看</el-button>
                </template>
              </el-table-column>
            </el-table>
          <div class="pdtb075 tc">
            <el-pagination
              background
              layout="prev, pager, next"
              @current-change="pageChange"
              :total="pageCount">
            </el-pagination>
          </div>
          </div>
      </el-main>
    </el-container>
  </div>
</template>
<script type="text/ecmascript-6">
  import {getDateList,createData} from '../../api/api';
  export default {
    data(){
      return {
        statusList: [
          {status: "0 3,in",text: '全部'},
          {status: "0",text: '待付款'},
          {status: "1",text: '未开始'},
          {status: "2",text: '进行中'},
          {status: "3",text: '已结束'}
        ], //状态列表
        statusSelect: "0 3,in", //选择的状态
        list: [], //问诊列表
        pageCount: 0, //总数
        curPage:1 //当前页数
      }
    },
    created(){
      this.getData();
    },
    methods:{
      getData(){ //获取用户列表数据
        let o = {
          "model": "Subscribes",
          "offset":this.curPage - 1,
          "limit":10,
          "with":{
            "0":"doctors",
            "1":"orders",
            "2":"doctorInquirys"
          },
          "orderBy":"create_time desc",
          "condition": {
            "is_delete":0,
            status: this.statusSelect
          },
          "search": {
          }
        };
        getDateList(o).then((data) => {
          console.log(data);
          this.list = data.data.data.data;
          this.pageCount = data.data.data.count - 0;
        })
      },
      pageChange(e){
        this.curPage = e;
        this.getData();
      },
      seeDetail(id){ //查看详情
        this.$router.push('/askDetails?id=' + id);
      },
      userDelete(id){ //用户删除操作
        this.$confirm('要删除这个用户吗?','提示',{
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'info '
        }).then(() => {
          this.delFn(id);
        });
      },
      delFn(id){ //删除请求
        let o =  {
          "model": "Users",
          "data": {
            "is_delete": "1"
          },
          "update_condition":{
            "id":id
          }
        };
        createData(o).then((data) => {
          if(data.data.code == 200){
            this.applySwitch = false;
            this.getData();
            this.$message({
              type: 'success',
              message: '删除成功!'
            });
          }else{
            this.$message({
              type: 'error',
              message: '删除失败'
            });
          }
        })
      }
    }
  }
</script>
<style lang="scss">
  .askList .el-form-item{
    display: inline-block;
    width: 260px;
  }
</style>
